import React, { Suspense } from 'react';
import ReactDOM from 'react-dom/client';
import { HashRouter } from 'react-router-dom'
import { Provider } from 'react-redux'
import { ThemeProvider } from 'styled-components'

import store from './store'
import App from './App';
import 'normalize.css'
import './assets/css/reset.less'
import theme from './assets/theme'
import {UseContext,ThemeContext} from './views/demo/useContext/context'

const root = ReactDOM.createRoot(document.getElementById('root'));
// UseContext

//注意： UseContext.Provider 里的值 可以是异步加载过来的值  
//  这里没有发起数据请求 我就直接写固定的值了 
// UseContext 在这里 插入值 在组件里开始 使用值 不用考虑是否能拿到值 
// 这里就相当于是在全局里 压入值了 

root.render(
  
  <Suspense fallback="loading....">
    <Provider store={store}>
        <ThemeProvider theme={theme}>
          <UseContext.Provider value={{name:'ys',age:18}}>
            <ThemeContext.Provider value={{color:'red',size:30}}>
                <HashRouter>
                  <App />
              </HashRouter>
            </ThemeContext.Provider>
          </UseContext.Provider>
            
        </ThemeProvider>
    </Provider>
  </Suspense>
    
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
